import 'package:flutter/material.dart';
import 'package:flutter_1111/utils/is_or_not_empty.dart';
import 'package:flutter_1111/utils/view_util.dart';

import '../widget/LoginBtn.dart';
import '../widget/input_widget.dart';

// 登录页
class LoginPage extends StatefulWidget {
  const LoginPage({super.key});

  @override
  State<LoginPage> createState() => _LoginPageState();
}

class _LoginPageState extends State<LoginPage> {
  // 用于判断是否启用登录按钮 默认是取消的
  bool loginEnable = false;
  // 用户名
  String? userName;
  // 存储密码
  String? password;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      // stack组件实现叠加效果
      body: Stack(
        // stack组件里面的内容写在children中
        children: [
          // 把组件封装起来 返回一个数组用...识别数组
          ..._background(),
          _content(),
        ],
      ),
    );
  }

  List<Widget> _background() {
    return [
      Positioned.fill(
        child: Image.asset(
          "images/login-bg1.jpg",
          fit: BoxFit.cover,
        ),
      ),
      Positioned.fill(
        child: Container(
          decoration: const BoxDecoration(
            color: Colors.black54,
          ),
        ),
      ),
    ];
  }

  Widget _content() {
    return Positioned.fill(
      left: 25,
      right: 25,
      child: ListView(
        children: [
          hiSpace(height: 150),
          const Text(
            "账号密码登录",
            style: TextStyle(fontSize: 26, color: Colors.white),
          ),
          // 间隔
          hiSpace(height: 40),
          Align(
            alignment: Alignment.centerRight,
            child: InkWell(
              onTap: () {
                // 这里添加注册页面导航逻辑
                print('导航到注册页面');
              },
              child: const Text(
                "注册账号",
                style: TextStyle(color: Colors.white),
              ),
            ),
          ),
          // 输入框
          InputWidget(
            hint: '请输入用户名',
            obscureText: false,
            keyboardType: TextInputType.number,
            onChanged: (text) {
              userName = text;
              _checkInput();
            },
          ),
          const Divider(
            height: 1,
            thickness: 1,
            color: Colors.white,
          ),
          hiSpace(height: 10),
          InputWidget(
            hint: "请输入密码",
            obscureText: true,
            onChanged: (text) {
              password = text;
              _checkInput();
            },
          ),
          const Divider(
            height: 1,
            thickness: 1,
            color: Colors.white,
          ),
          hiSpace(height: 15),
          LoginBtn(
            title: '登录',
            enable: loginEnable,
            onPressed: loginEnable ? login : null,
          ),
        ],
      ),
    );
  }

  void _checkInput() {
    bool enable;
    if (isNotEmpty(userName) && isNotEmpty(password)) {
      enable = true;
    } else {
      enable = false;
    }
    setState(() {
      loginEnable = enable;
    });
  }

  void login() {
    // 登录逻辑实现
    print('执行登录: username=$userName, password=$password');
    // 这里可以添加实际的登录API调用
  }
}